const OpenBrowserPlugin = require('open-browser-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
    devtool: "source-map",
    entry: __dirname + "/app/main.js",
    output: {
        path: __dirname + "/public",
        filename: 'bundle.js'
    },
    resolve: {
        alias: {
            'animate$': 'animate.css/animate.css'
        }
    },
    module: {
        loaders: [{
            test: /\.json$/,
            loader: "json"
        }, {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel'
        }, {
            test: /\.(scss|css)$/,
            loader: ExtractTextPlugin.extract('style', 'css','sass')
        },{
            test:/.(png)|(jpg)$/,
            loader: "url?limit=50000"}
        ]
    },
    devServer: {
        contentBase: './public',
        colors: true,
        historyApiFallback: true,
        inline: true,
        port:80
    },
    plugins: [
        new OpenBrowserPlugin({
            url: 'http://localhost:8081'
        }),
        new ExtractTextPlugin("style.css"),
        new ManifestPlugin({
            fileName:'my-manifest.json',
            basePath:'/base/'
        }),
        new HtmlWebpackPlugin({
            template: __dirname + '/app/index.html',
            filename:"index.html",
            inject:true
        }),
    ]
};
